<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="webjars/jquery/3.6.4/jquery.min.js"></script>
    <link rel="stylesheet" href="webjars/bootstrap/5.2.3/css/bootstrap.min.css">
    <script>
         $(function (){
             $("[name='pagesize']").change(function (){
                 var size = $(this).val();
                 alert(size);
                 location="list?pagesize="+size;

             })
             //全选
             $("#all").click(function (){
                 let flag=$(this).prop("checked");
                 $("[name='chk']").prop("checked",flag);
             })
             //删除
             $(".btn-warning").click(function (){
                 //判断是否选择
                 let arr=$("[name='chk']:checked");
                 if(arr.length==0){
                     alert("请选择！");
                 }else{
                     let values="";
                     //获取name为chk的并且被选择的值
                     arr.each(function (){
                         values += $(this).val()+",";
                     })
                     alert(values);
                     if(confirm("确认要删除"+values+"数据吗？")){
                         $.getJSON(
                             "delete",
                             {ids:values},
                             function (obj){
                                 if(obj){
                                     alert("删除成功！");
                                     location="list"
                                 }else{
                                     alert("删除失败！");
                                 }
                             }
                         )
                     }
                 }
             })
              //修改的请求
             $(".btn-primary").click(function (){
                 let m=$(this).val();
                 alert(m);
                 location="find?id="+m;
             })
         })
    </script>
</head>
<body>

        <div class="container">
             <table class="table table-hover table-bordered">
                  <tr>
                      <th>
                          <input type="checkbox" id="all">全选
                          <button class="btn btn-warning">删除</button>
                      </th>
                      <th>编号</th>
                      <th>姓名</th>
                      <th>年龄</th>
                      <th>入职时间</th>
                      <th>地址</th>
                      <th>密码</th>
                      <th>角色</th>
                      <th>
                          <a th:href="@{toadd}">新增用户</a>
                      </th>
                  </tr>
                 <tr th:each="user:${pager.list}" th:object="${user}">
                     <td><input type="checkbox" name="chk" th:value="*{id}"></td>
                      <td th:text="*{id}"></td>
                      <td th:text="*{name}"></td>
                      <td th:text="*{age}"></td>
                      <td th:text="*{#dates.format(in_time,'yyyy-MM-dd')}"></td>
                      <td th:text="*{address}"></td>
                      <td th:text="*{pwd}"></td>
                      <td >
                          <span th:each="role:*{roles}" th:object="${role}">
                          <span th:text="*{rname}"></span>&nbsp;&nbsp;
                          </span>
                      </td>
                     <td>
                         <button class="btn btn-primary" th:value="*{id}">修改</button>
                     </td>
                 </tr>
                 <tr>
                     <td align="center" colspan="10">
                         共<span th:text="${pager.pages}"></span>页,
                         共<span th:text="${pager.total}"></span>条数据,
                         当前是<span th:text="${pager.pageNum}"></span>页,
                         <a th:href="@{list(offset=1)}">首页</a>
                         <a th:href="@{list(offset=${pager.prePage})}" th:if="${pager.hasPreviousPage}">上页</a>
                         <select name="pagesize">
                             <option value="2">2</option>
                             <option value="3">3</option>
                             <option value="4">4</option>
                         </select>
                         <a th:href="@{list(offset=${pager.nextPage})}" th:if="${pager.hasNextPage}">下页</a>
                         <a th:href="@{list(offset=${pager.pages})}">末页</a>

                     </td>
                 </tr>
             </table>
        </div>
</body>
</html>
